<template>
	<scroll-view
		class="body"
		:style="styles"
		scroll-y
		refresher-default-style="white"
		refresher-background="#f3f4f6"
		:refresher-triggered="refresherTriggered"
		:refresher-enabled="refresherEnabled"
		@scrolltoupper="handleScrolltoupper"
		@scrolltolower="handleScrolltolower"
		@scroll="handleScroll"
		@refresherpulling="handleRefresherpulling"
		@refresherrefresh="handleRefresherrefresh"
	>
		<slot></slot>
	</scroll-view>
</template>

<script>
const statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
export default {
	props: {
		refresherEnabled: {
			//下拉刷新是否开启
			type: Boolean,
			default: true
		},
		refresherTriggered: {
			//下拉刷新状态
			type: Boolean,
			default: true
		}
	},
	data() {
		return {};
	},
	computed: {
		styles() {
			let style = {};
			style['top'] = statusBarHeight + 44 + 'px';

			return style;
		}
	},
	methods: {
		handleScrolltoupper() {
			this.$emit("scrolltoupper",{});
		},
		handleScrolltolower() {
			this.$emit("scrolltolower",{});
		},
		handleScroll(){
			this.$emit("scroll",{})
		},
		handleRefresherpulling(){
			this.$emit("refresherpulling",{})
		},
		handleRefresherrefresh(){
			this.$emit("refresherrefresh",{})
		}
	}
};
</script>
<style lang="scss" scoped>
.body {
	
	position: absolute;
	bottom: 0;
	z-index: -999;
	
	background-color: #fff;
}
.refresh-animation-wrap{
	
	position: absolute;
	left: 0;
	right: 0;
	text-align: center;
}
</style>
